<script type="text/javascript" src="{$base_dir}js/AJAX_Icd10Selector.js"></script>

<script type="text/javascript">
	var initIcd10BigGroup = parseInt({$initIcd10BigGroup});	
{literal}	
	$(document).ready(function() {
		if (initIcd10BigGroup > 0) {
			$('ul#icd10Group li#group_' + initIcd10BigGroup).addClass('active');
		}					
	});
{/literal}
</script>

<div id="divIcd10List" title="{translate}LOOK UP ICD10{/translate}" style="display: none;">
	<div class="filter_container">
		<span class="label">{translate}Block{/translate}:</span>
		<select style="width: 400px" id="icd10ChapterSelection" onchange="javascript:loadIcd10Chapter()">        
		{foreach from=$icd10Chapter item=chapter key=key}
			{if ($chapter.icd10_chapter_id == $initIcd10Chapter)}
				<option value='{$chapter.icd10_chapter_id}' selected="selected">{$chapter.code} - {$chapter.name}</option>
			{else}
				<option value='{$chapter.icd10_chapter_id}' >				               		
					{$chapter.code} - {$chapter.name}
				</option>
			{/if}
		{/foreach}    
		</select> 
		<div id='result' colspan='3' style='padding: 10px 5px 0px 10px; color:blue;'>
			<input id='selectedCode' value='' type='hidden'/>
			<input id='selectedName' value='' type='hidden'/>
			<i>{translate}Select big group > Select small group > Select disease{/translate}</i>
		</div>
	</div>

	<div style="height: 370px; background: #333; overflow: auto; margin-top: 5px;">         
    	<table cellspacing='0' cellpadding='0' class='icd10Selector'>    	
			<tr>
				<th style='width: 33%;'>{translate}BIG GROUP{/translate}</th>
				<th style='width: 33%;'>{translate}SMALL GROUP{/translate}</th>
				<th style='width: 34%;'>{translate}DISEASE{/translate}</th>
			</tr>
			<tr>
				<td id='icdGroup'>{$icd10BigGroup}</td>
				<td id='icdBlock'>{$icd10SmallGroup}</td>
				<td id='icdItem'></td>
			</tr>			
		</table>
	</div>			
   
</div>